<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0"
    />
    <link rel="icon" href="dist/logo.ico" />
    <title>思绪思维导图</title>
    <script>
      // 自定义静态资源的路径
      window.externalPublicPath = './dist/'
      // 接管应用
      window.takeOverApp = false
    </script>
    <script
      charset="UTF-8"
      id="LA_COLLECT"
      src="//sdk.51.la/js-sdk-pro.min.js"
    ></script>
    <script>
      try {
        LA.init({
          id: 'KRO0WxK8GT66tYCQ',
          ck: 'KRO0WxK8GT66tYCQ',
          autoTrack: false
        })
      } catch (error) {
        console.log(error)
      }
    </script>
  </head>
  <body>
    <noscript>
      <strong
        >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
        properly without JavaScript enabled. Please enable it to
        continue.</strong
      >
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
    <script>
      const getDataFromBackend = () => {
        return new Promise((resolve, reject) => {
          setTimeout(() => {
            resolve({
              mindMapData: {
                root: {
                  data: {
                    text: '根节点'
                  },
                  children: []
                },
                theme: {
                  template: 'avocado',
                  config: {}
                },
                layout: 'logicalStructure',
                config: {},
                view: null
              },
              mindMapConfig: {},
              lang: 'zh',
              localConfig: null
            })
          }, 200)
        })
      }
      const setTakeOverAppMethods = data => {
        window.takeOverAppMethods = {}
        // 获取思维导图数据的函数
        window.takeOverAppMethods.getMindMapData = () => {
          return data.mindMapData
        }
        // 保存思维导图数据的函数
        window.takeOverAppMethods.saveMindMapData = data => {
          console.log(data)
        }
        // 获取思维导图配置，也就是实例化时会传入的选项
        window.takeOverAppMethods.getMindMapConfig = () => {
          return data.mindMapConfig
        }
        // 保存思维导图配置
        window.takeOverAppMethods.saveMindMapConfig = config => {
          console.log(config)
        }
        // 获取语言的函数
        window.takeOverAppMethods.getLanguage = () => {
          return data.lang
        }
        // 保存语言的函数
        window.takeOverAppMethods.saveLanguage = lang => {
          console.log(lang)
        }
        // 获取本地配置的函数
        window.takeOverAppMethods.getLocalConfig = () => {
          return data.localConfig
        }
        // 保存本地配置的函数
        window.takeOverAppMethods.saveLocalConfig = config => {
          console.log(config)
        }
      }
      window.onload = async () => {
        if (!window.takeOverApp) return
        // 请求数据
        const data = await getDataFromBackend()
        // 设置全局的方法
        setTakeOverAppMethods(data)
        // 思维导图实例创建完成事件
        window.$bus.$on('app_inited', mindMap => {
          console.log(mindMap)
        })
        // 可以通过window.$bus.$on()来监听应用的一些事件
        // 实例化页面
        window.initApp()
      }
    </script>
  </body>
</html>
